<template>
   <h1 class="text-xl">反馈信息</h1>
   <el-card class=" " >
     <el-form ref="ruleFormRef"   :model="ruleForm"  status-icon
              :rules="rules" label-width="120px"   class="demo-ruleForm" >

          <el-form-item   prop="feedback" size="small" class="mt-2 ml-[-120px]">          
            <el-input type="textarea" v-model="ruleForm.feedback"  rows="15" placeholder="由于QQ容易沉底，请在这输入您的建议,反馈或合作意向,让我们会做得更好。"  class="w-full " />
          </el-form-item>

           <el-form-item label="联系方式" prop="contact" size="small" class="-mt-0 -ml-14">
                <div class="flex"> 
                    <el-select v-model="ruleForm.contacttype" class="w-18 h-8"  size="small">
                        <el-option
                          v-for="item in options"  :key="item.label"  :label="item.label"  :value="item.label" />
                    </el-select>
                    <el-input v-model="ruleForm.contact"  size="small" placeholder="请留下您的邮箱号" autocomplete="off" class="w-80  h-6 ml-2"  />
                </div>
           </el-form-item>

           <el-row class="">
              <el-col :span="6"></el-col>
              <el-col :span="18">
                  <el-button  size="small" round @click="onsubmit"  class="bg-black text-white ml-[75%]" style="padding:1rem" :disabled="submit_disable_attr">提交</el-button>
              </el-col>
           </el-row>

     </el-form>
  </el-card>
</template>

<script setup>
import {ref, onMounted, getCurrentInstance, onDeactivated} from 'vue';
import { ElMessage ,ElMessageBox  } from 'element-plus'
const ruleForm = ref({
  feedback:"",
  contact:"",
  contacttype:"手机号"
})
const ruleFormRef = ref(null)

const rules = ref({
  contact:[
    {required:true, message:'不能为空',trigger:'blur'}
  ],
  feedback:[
    {required:true, message:'不能为空',trigger:'blur'}
  ]
})

const submit_disable_attr = ref(false)
const options = [

  {
    label: '邮箱',
  } 
]


onMounted(() => {

});

const onsubmit = () => {
   if (!ruleForm.value) return
   ruleFormRef.value.validate((valid) => {
        if (ruleForm.value.contacttype=='手机号') {
            let Regex = /^1[3-9]\d{9}$/;
            let regexret = Regex.test(ruleForm.value.contact);
            if (regexret==false) {
                return ElMessage.error("您输入的手机号是错误的,请修正")
            }
        }
        if (ruleForm.value.contacttype=='邮箱') {
            let Regex = /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;
            let regexret = Regex.test(ruleForm.value.contact);
            if (regexret==false) {
                return ElMessage.error("您输入的邮箱是错误的,请修正")
            }
        }
        if (ruleForm.value.contact.length<10) {
            return ElMessage.error("您输入的内容过少,请修正")
        }

        let cn = ruleForm.value.feedback+"\n\n"+"联系方式："+ruleForm.value.contacttype+"["+ ruleForm.value.contact+"]"
        
        window.pywebview.api.pyFeedBack(cn).then((r) => {
            if (r.status=='success') {
                submit_disable_attr.value = true
                return ElMessage.success("提交成功,我会第一时间处理")
            }
        })
   })
   
}
 
</script>

